<template>
	<cl-drawer
		ref="drawer"
		:props="{
			title: '新增跟进',
			size: '40%',
			appendToBody: true
		}"
		showConfirm
		confirmText="提交跟进"
		@close="reset"
		@confirm="submit"
		:saving="saving"
	>
		<el-form ref="form" label-position="top" :model="form" :rules="rules">
			<el-form-item label="跟进信息">
				<el-card shadow="never">
					<el-row :gutter="20">
						<el-col :span="12">
							<el-form-item label="跟进日期" prop="follow_time">
								<cl-date-picker
									v-model="form.follow_time"
									placeholder="选择日期"
									style="width: 100%"
									value-format="yyyy-MM-dd"
									:clearable="false"
									@change="followTimeChange"
								/>
							</el-form-item>
						</el-col>
						<el-col :span="12">
							<el-form-item label="跟进方式" prop="follow_type">
								<cl-select
									v-model="form.follow_type"
									placeholder="请选择跟进方式"
									style="width:100%"
								>
									<el-option
										v-for="(item, index) in followTypes"
										:key="index"
										:label="item.label"
										:value="item.value"
									/>
								</cl-select>
							</el-form-item>
						</el-col>
						<el-col :span="12">
							<el-form-item label="下次跟进日期" prop="follow_next">
								<cl-date-picker
									v-model="form.follow_next"
									placeholder="选择日期"
									style="width: 100%"
									value-format="yyyy-MM-dd"
									:picker-options="pickerOptions"
								/>
							</el-form-item>
						</el-col>
					</el-row>
				</el-card>
			</el-form-item>
			<el-form-item label="跟进内容" prop="content">
				<el-input
					v-model="form.content"
					placeholder="请填写跟进内容"
					type="textarea"
					:rows="3"
				/>
			</el-form-item>
		</el-form>
	</cl-drawer>
</template>
<script>
import dayjs from "dayjs";
// import meUpload from "@/views/case/components/upload.vue"
export default {
	components: {
		// meUpload
	},
	props: {
		detail: {
			type: Object,
			default: () => ({})
		}
	},
	data() {
		return {
			pickerOptions: {
				disabledDate: time => {
					const { follow_time } = this.form;
					let followTime = dayjs(follow_time);
					let date = dayjs(time);
					return date.isBefore(followTime);
				}
			},
			followTypes: [
				{ label: "电话", value: 1 },
				{ label: "QQ", value: 2 },
				{ label: "微信", value: 3 },
				{ label: "面聊", value: 4 }
			],
			form: {
				follow_time: dayjs().format("YYYY-MM-DD"),
				follow_type: "",
				follow_next: "",
				follow_status: "",
				content: "",
				cus_name: "",
				dept_id: "",
				cus_id: ""
			},
			rules: {
				follow_time: [{ required: true, message: "请选择跟进日期", trigger: "change" }],
				follow_type: [{ required: true, message: "请选择跟进方式", trigger: "change" }],
				// follow_next: [{ required: true, message: "请选择下次跟进日期", trigger: "change" }],
				content: [{ required: true, message: "请填写跟进内容", trigger: "change" }]
			},
			saving: false
		};
	},
	methods: {
		open() {
			this.$refs.drawer.create();
			console.log(this.detail,'3333333333333333')
			this.form.follow_status=this.detail.status?? 1
		},
		reset() {
			this.$refs.form.resetFields();
		},
		close() {
			this.$refs.drawer.close();
		},
		followTimeChange() {
			this.form.follow_next = "";
		},
		submit() {
			this.$refs.form.validate(async (valid, errors) => {
				this.showFormErr(errors);
				if (!valid) return;
				const { cus_id, dept_id, biz_id } = this.detail;

				let form = {
					...this.form,
					cus_id,
					dept_id,
					biz_id
				};
				this.saving = true;
				await this.$service.cart.addFollow(form).done(() => {
					this.saving = false;
				});
				this.$message.success("操作成功");
				this.$emit("confirm");
				this.close();
			});
		},
		onUploadSuccess(response, file) {
			console.log(response, file,'000000000000000000')
           
		}
	}
};
</script>
